import React, { Component } from 'react';
// 导入css文件
import '../../styles/index/MyEntry.css'
// 封装请求
import { index_nav } from '../../api/index'

// 通过this获取当前组件实例
class MyEntry extends Component {
    constructor(props) {
        super(props);
        this.state = {
            list: [
            ]
        }
    }

    // 获取导航数据
    componentDidMount(){
        index_nav().then((res)=>{
            this.setState({list:res.data.list})
        })
    }
     

    render() {
        return (
            <div>
                <span className='title'>一分抵一元,点击此处查看</span>
                <div className="list">
                    {
                        this.state.list.map((item, index) => {
                            return (
                                <div className='list-one' key={index}>
                                    <img src={item.pic} alt="" />
                                    <p>{item.name}</p>
                                </div>
                            )
                        })
                    }

                    {
                        //如果列表为空，显示提示标签
                        this.state.list.length == 0 &&
                        <div className='empty'>网络异常，请尝试刷新页面</div>
                    }
                </div>
            </div>
        );
    }
}

export default MyEntry;